<template>
 <el-table :data="tableData" border style="width: 100%">
  <el-table-column prop="index" width="80" align="center" />
  <el-table-column label="头像" align="center" width="250">
   <template #default="{ row }">
    <div class="block">
     <el-avatar :size="30" :src="row.img" />
    </div>
    <!-- <el-button type="primary" round v-else @click="SetManager(row.uid)">设为管理员</el-button> -->
   </template>
  </el-table-column>
  <el-table-column prop="name" label="昵称" width="180" align="center" />
  <el-table-column prop="concernTime" label="关注日期" align="center" />
  <el-table-column label="" align="center" width="150">
   <template #default="{ row }">
    <el-dropdown>
     <el-button size="small" type="info">
      封禁<el-icon class="el-icon--right"><arrow-down /></el-icon>
     </el-button>
     <template #dropdown>
      <el-dropdown-menu>
       <el-dropdown-item>Action 1</el-dropdown-item>
       <el-dropdown-item>Action 2</el-dropdown-item>
       <el-dropdown-item>Action 3</el-dropdown-item>
       <el-dropdown-item>Action 4</el-dropdown-item>
       <el-dropdown-item>Action 5</el-dropdown-item>
      </el-dropdown-menu>
     </template>
    </el-dropdown>
    <!-- <el-button type="primary" round v-else @click="SetManager(row.uid)">设为管理员</el-button> -->
   </template>
  </el-table-column>
  <el-table-column label="" align="center" width="150">
   <template #default="{ row }">
    <el-button type="primary" round>设为管理员</el-button>
   </template>
  </el-table-column>
  <el-table-column label="" align="center" width="100">
   <template #default="{ row }">
    <el-button type="primary" round>对话</el-button>
    <!-- <el-button type="primary" round v-else @click="SetManager(row.uid)">设为管理员</el-button> -->
   </template>
  </el-table-column>
  <template #empty>
   <el-empty description="暂无数据" />
  </template>
 </el-table>
 <div class="fenye" style="margin-top: 30px">
  <el-pagination
   v-model:current-page="currentPage"
   v-model:page-size="pageSize"
   layout="prev, pager, next, jumper"
   :total="totalNum"
   @current-change="handleCurrentChange"
  />
 </div>
</template>

<script setup>
import dayjs from 'dayjs'
import { ref, onMounted } from 'vue'
import { getUser, test } from '@/api/api'
const tableData = ref([])
const currentPage = ref('0')
let pageSize = 11
const totalNum = tableData.value.length
const getuser = (num, size) => {
 getUser(num, size).then((i) =>
  i.data.forEach((item) => {
   let data = {
    openid: item.openid,
    index: item.index,
    name: item.name,
    headimg: item.headimg,
    concernTime: dayjs(item.concernTime).format('YYYY-MM-DD'),
    ban: item.ban,
    permissions: item.permissions
   }
   tableData.value.push(data)
  })
 )
}

onMounted(() => {
 getuser(1, 10)
})
</script>
